<template>
  <div class="box">
    
      <!-- 左侧导航栏 -->

      <side-Bar></side-Bar>

      <!-- 右侧主体 -->
      <el-main>
        <!-- 左边主体 -->
        <el-container>
          <!-- 头部位置 -->
          <cephalo-some></cephalo-some>
          
          <!-- 内容区 -->
          <div class="cont">

          <router-view></router-view>
          </div>
          
        </el-container>
      </el-main>
   
  </div>
</template>

<script>
// 引入左侧导航
import sideBar from "../../components/sidebar.vue";
// 头部组件
import cephaloSome from "../../components/cephalosome.vue";
// // 引入内容区
// import graph from '../router/graph.vue'

export default {
  name: "Home",
  props: [""],
  data() {
    return {
      transitionName: "vux-pop-in",
    };
  },

  components: {
    sideBar,
    cephaloSome,
  },

  computed: {},

  beforeMount() {},

  mounted() {},

  methods: {},

  watch: {},
};
</script>
<style lang="scss" scoped>
.box {
  display: flex;
  height: 100%;


    // 右侧主体样式
    .el-main {
      padding: 0;
      .el-container {
        height: 100%;
        display: flex;
        flex-direction: column;
        .cont{
          box-sizing:border-box;
          padding: 20px;
          height: 100%;
          width: 100%;
        }
      }
    }
  
}
</style>
